
import {login, report} from './request.js'


(function(){
    const { username, phoneNum, idCard, startBook, myBook, alertTips }={
        username: document.getElementById('username'),
        phoneNum: document.getElementById('phoneNum'),
        idCard: document.getElementById('idCard'),
        startBook: document.getElementById('startBook'),
        myBook: document.getElementById('myBook'),
        alertTips: document.getElementById('alertTips'),
    }
    //input框验证事件//////////////////////////////////////////////////////////
    //正则表达式,算了
    let [flag_A,flag_B,flag_C] = [false,false,false]
    function fnA(){
        if(username.value.trim()=="" || username.value==null){
            alertTips.firstElementChild.innerHTML = `用户名不得为空`
            alertTips.classList.remove('scale0')
            flag_A = false
        }
        else{
            flag_A = true
        }
        console.log(flag_A)
        return flag_A
    }
    function fnB(){
        if(phoneNum.value.length != 11){
            alertTips.firstElementChild.innerHTML = `请输入正确的11位手机号`
            alertTips.classList.remove('scale0')
            flag_B = false
        }
        else{
            flag_B = !isNaN(phoneNum.value) ? true : false
        }
        console.log(flag_B)
        return flag_B
    }
    function fnC(){
        if(idCard.value.length != 18){
            flag_C = false
        }
        else{
            flag_C = true 
        }
        console.log(flag_C)
        return flag_C
    }
    username.addEventListener('blur',function(){
        fnA()
    })
    phoneNum.addEventListener('blur',function(){
        fnB()
    })
    idCard.addEventListener('blur',function(){
        fnC()
    })
    alertTips.addEventListener('click',function(){
        $('#alertTips').addClass('scale0')
    })
    //////////////////////////////////////////////////////////////////////////
    
    //开始预约
    startBook.addEventListener('click', async function(){
        // 在点击预约之前,需要先对三个ipt框做正则的检验,只有同时为true的时候,我们才真正的发起请求
        if(fnA() == true && fnB() == true && fnC() == true){
            // 通过正则
            $('#spinner_filter').removeClass('display_none')
                    // trim()去除字符串两边的空格
                    let data = {
                        phone: phoneNum.value.trim(),
                        card: idCard.value.trim(),
                        name: username.value.trim()
                    }
                    let res = await login(data)
                    console.log(res)
                        //储存token
                        // token值作用有两个
                        // token看起来是乱码但实则是一个非常有规律的内容
                        // 前端通过请求传递token值给后台,后台通过特定的语法解析
                        // 1.用来识别当前的具体用户
                        // 2.可以防止csrf攻击
                        // 关于token值的传递不是每个项目都是以参数的形式传递
                        // 还有可能放在header请求头当中
                    sessionStorage.setItem("token",res.result.token);
                    sessionStorage.setItem("uname",username.value.trim());
                    sessionStorage.setItem("uphone",phoneNum.value.trim());
                    sessionStorage.setItem("ucard",idCard.value.trim());
                    document.getElementById('spinner_filter').classList.add('display_none')
                    location.href = "./html/book.html"
            }
        else{
            console.log($('#alertTips'))
            $('#alertTips').children()[0].innerHTML = `请输入正确的<br>用户名,手机号,身份证`
            $('#alertTips').removeClass('scale0')
        }
    })
    //我的预约
    myBook.addEventListener('click',async function(){
        if(fnA() == true && fnB() == true){
            let data = {
                phone: phoneNum.value.trim(),
                card: idCard.value.trim(),
                name: username.value.trim()
            }
            let res = await login(data)
                //储存token
                sessionStorage.setItem("token",res.result.token);
                sessionStorage.setItem("uname",username.value.trim());
                sessionStorage.setItem("uphone",phoneNum.value.trim());
                location.href = './html/mybook.html'
            
        }
        else{
            $('#alertTips').children()[0].innerHTML = `请输入正确的<br>用户名与手机号`
            $('#alertTips').removeClass('scale0')
        }
    })
    
})()